<!doctype html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <title>Connect JavaScript - jQuery Login Example</title>
  </head>
  <body>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

    <form id="usersettingsform" method="POST" action="">
        <input type="hidden">
    </form>

    <div id="fb-root"></div>
    <script src="http://connect.facebook.net/en_US/all.js"></script>
    <script>

      // initialize the library with the API key
      FB.init({ apiKey: 'a455f3f21ce31633c82d263fd5fa0aa8' });

      // fetch the status on load
      FB.getLoginStatus(handleSessionResponse);

      // handle a session response from any of the auth related calls
      function handleSessionResponse(response) {
        // if we dont have a session, just hide the user info
        if (!response.session) {
          FB.login(handleSessionResponse);
          return;
        }

        // if we have a session, query for the user's profile picture and name
        FB.api(
          {
            method: 'fql.query',
            query: 'SELECT name FROM profile WHERE id=' + FB.getSession().uid
          },
          function(response) {
            var user = response[0];
            $('#user-info').html('<img src="' + user.pic + '">' + user.name).show('fast');
          }
        );
      }
    </script>
  </body>
</html>